import {XgPlayer} from "../index";
import fScreen from "fscreen";

export class XgControlBarrage {
  root!: HTMLElement;
  open = true;
  constructor(private player: XgPlayer) {
    this.init();
  }
  private init() {
    this.root = document.createElement('div');
    this.root.className = 'control-icon-wrap barrage-wrap';
    this.root.innerHTML = `<svg class="icon icon-control-player" aria-hidden="true">
                              <use xlink:href="#icon-danmuguanbi"></use>
                            </svg>`;

    this.root.addEventListener('click', this.handleToggleBarrage.bind(this));
  }

  private handleToggleBarrage() {
    this.open = !this.open;
    const iconSvg = this.root.getElementsByTagName('use')[0];
    if (iconSvg) {
      const type = this.open ? 'danmuguanbi' : 'danmukaiqi';
      iconSvg.setAttribute('xlink:href', '#icon-' + type);
    }
  }
}
